import React, { useRef, useState, useEffect } from 'react';
import { connect } from 'umi';
import TableDataBlock from '@/components/TableDataBlock';
import { reloadTab } from '@/utils/utils';
import { notification } from 'antd';
import { Button, Modal, Space, Form, Row, Col } from 'antd';
import { workType_status } from '@/common/contact'
const AuthFormSetting = (props) => {
  const {
    visible = false,
    onClose,
    loading,
    organizationAuthAdminList,
    dispatch,
    onChange,
    stageAdminList
  } = props;
  const { show = false, detail = {}, } = visible;
  const { stage, list = [], disabledList = [], } = detail
  const [selectedRowKeys, setSelectedRowKeys] = useState([])
  const childRef = useRef();

  useEffect(() => {
    if (show) {
      setSelectedRowKeys(list)
    }
    else {
      setSelectedRowKeys([])
    }
  }, [show])
  const rowSelectionChecked = {
    type: 'checkBox',
    hideSelectAll: true,
    getCheckboxProps: (record) => {
      return {
        disabled: disabledList.reduce((item, index) => {
          if (item) {
            return item
          }
          else {
            if (index.id === record.id) {
              return true
            }
            return item
          }
        }, false),
        // Column configuration not to be checked
        id: record.id,
      };
    },
    onChange: (selectedRowKeys, selectedRows) => {
      setSelectedRowKeys(selectedRows);
    },
    selectedRowKeys: selectedRowKeys.map((item) => {
      return item.id.toString();
    }),

    preserveSelectedRowKeys: true,
  };
  const handleUpAudit = () => {
    onChange && onChange(selectedRowKeys.map(item => {
      const { workType = 'main' } = item
      return {
        ...item,
        workType,
        stage: stage
      }
    }), detail)
    onClose()
  };
  const getColumns = [
    {
      title: '姓名',
      dataIndex: 'username',
    },
    {
      title: '手机号',
      dataIndex: 'mobile',

    },
  ];
  const modalProps = {
    title: `负责设置`,
    width: 900,
    visible: typeof visible === 'boolean' ? visible : show,
    maskClosable: true,
    destroyOnClose: true,
    zIndex: 1001,
    confirmLoading: loading,
    footer: <Space>
      <Button onClick={() => onClose()}>取消</Button>
      <Button type='primary' onClick={() => handleUpAudit()}>确定</Button>
    </Space>
  };
  return (
    <Modal {...modalProps} onCancel={onClose} onOk={handleUpAudit}>
      <TableDataBlock
        params={{ stage }}
        rowSelection={rowSelectionChecked}
        cRef={childRef}
        loading={loading}
        columns={getColumns}
        rowKey={(record) => `${record.id}`}
        dispatchType={'weCom/fetchSearchOrganizationAdmin'}
        {...stageAdminList}
      ></TableDataBlock>
    </Modal>
  );
};

export default connect(({ weCom, loading }) => ({
  stageAdminList: weCom.organizationAuthAdminList,
  loading: loading.models.weCom || loading.models.subscriber,
}))(AuthFormSetting);
